import { createRouter, createWebHistory } from 'vue-router'
import { constantRouter, errorRouter, notFoundRouter } from './routeConfig'
import { getUrlQuery } from "../utils/common"
import { useLayoutStore } from "@/stores/layout"
const router = createRouter({
  history: createWebHistory(),
  routes: [
    {
      path: '/',
      name: 'layout',
      redirect: 'home',
      component: () => import('@/layout/index.vue'),
      children: []
    },
    {
      path: "/login",
      name: "login",
      component: () => import("@/views/login/index.vue")
    }
  ]
})
// 接下来是模拟constantRouter为远程数据
/**
 * 远程数据为拍平的一维数组，
 * 根据当前用户的角色相关信息和constantRouter中meta.role，对数组进行过滤之后，再进行动态路由添加
 * 然后对数据进行组装，得到我们想要的tree，方便加载menu-tree
 * 。。。
 * 在每次刷新之后，进行单点登录验证。
 * 获取用户信息，
 * 查询相应角色信息，
 * 查询相应路由表信息，
 * 对路由信息进行权限过滤，对路由表信息进行数据转换处理，
 * 动态添加路由
 * 生成菜单
 */
router.beforeEach(async (to, from, next) => {
  if (!to.matched?.length) {
    constantRouter.forEach((item) => {
      router.addRoute('layout', item)
    })
    errorRouter.forEach((item) => {
      router.addRoute('layout', item)
    })
    router.addRoute(notFoundRouter[0])
    return next({ ...to, replace: true })
  }
  const query = to.query
  if (query.layoutMode) {
    const layoutSetting = useLayoutStore().getLayout();
    layoutSetting.mode = query.layoutMode
    useLayoutStore().setLayout(layoutSetting)
    delete query.layoutMode;
    return next({ ...to, query, replace: true })
  }
  return next()
})
export default router
